<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">

    <link rel="shortcut icon" href="<!--{eval echo register_static('img/touch-icon-57x57.png');}-->">
    <title>粉粉管理系统</title>

    <!-- Bootstrap core CSS -->
    <link href="<!--{eval echo register_static('css/bootstrap.min.css');}-->" rel="stylesheet">
    <link href="<!--{eval echo register_static('css/bootstrap-reset.css');}-->" rel="stylesheet">
    <!--Animation css-->
    <link href="<!--{eval echo register_static('css/animate.css');}-->" rel="stylesheet">
    <!--Icon-fonts css-->
    <link href="<!--{eval echo register_static('assets/font-awesome/css/font-awesome.css');}-->" rel="stylesheet" />
    <link href="<!--{eval echo register_static('assets/ionicon/css/ionicons.min.css');}-->" rel="stylesheet" />
    <link href="<!--{eval echo register_static('assets/sweet-alert/sweet-alert.min.css');}-->" rel="stylesheet">
    <!-- Plugins css -->
    <link href="<!--{eval echo register_static('assets/modal-effect/css/component.css');}-->" rel="stylesheet">
    <!-- DataTables -->
    <link rel="stylesheet" href="<!--{eval echo register_static('assets/datatables/jquery.dataTables.min.css" rel="stylesheet');}-->" />
    <!-- Custom styles for this template -->
    <link href="<!--{eval echo register_static('css/style.css');}-->" rel="stylesheet">
    <link href="<!--{eval echo register_static('css/helper.css');}-->" rel="stylesheet">
    <!-- My styles for this template -->
    <link href="<!--{eval echo register_static('css/common.css');}-->" rel="stylesheet"></head>

<body>

    <!-- Aside Start-->
    <!--{template admin_v2/leftside}-->
    <!-- Aside Ends-->

    <!--Main Content Start -->
    <section class="content">

        <!-- Header -->
        <!--{template admin_v2/header}-->
        <!-- Header Ends -->

        <!-- Page Content Start -->
        <!-- ================== -->

        <div class="wraper container-fluid user-list">

            <div class="row">
                <div class="col-md-12">
                    <div class="panel panel-default">
                        <div class="panel-heading">
                            <h3 class="panel-title">管理员列表</h3>
                        </div>
                        <div class="panel-body">
                            <div class="row">
                                <div class="col-md-10 col-sm-10 col-xs-10">
                                	<form class="form-inline" role="form">
                                        <div class="form-group m-l-10">
                                            <input type="text" name="uid" class="form-control" id="inputYourText" placeholder="输入UID"></div>
                                        <button type="button" id="searchByUid" class="btn btn-success m-l-10">点击搜索</button>
                                    </form>
                                </div>
                                <div class="col-md-2 col-sm-2 col-xs-2">
                                    <button class="btn btn-info " id="addUser">增加管理员</button>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-md-12 col-sm-12 col-xs-12">
                                    <table id="datatable" class="table table-striped table-bordered">
                                        <thead>
                                            <tr>
                                                <th>UID</th>
                                                <th>昵称</th>
                                                <th>角色</th>
                                                <th>创建者</th>
                                                <th>时间</th>
                                                <th>操作</th>
                                            </tr>
                                        </thead>

                                        <tbody id="tbody_list">

                                        </tbody>
                                   </table>
                                </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                </div>
                <!-- Page Content Ends -->
                <!-- ================== -->

                <div id="con-close-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="display: none;"></div>
                <!-- /.modal -->

                <!-- Footer Start -->
                <!--{template admin_v2/footer}-->
                <!-- Footer Ends --> </section>
            <!-- Main Content Ends -->

            <!-- js placed at the end of the document so the pages load faster -->
            <script src="<!--{eval echo register_static('js/jquery.js');}-->"></script>
            <script src="<!--{eval echo register_static('js/bootstrap.min.js');}-->"></script>
            <script src="<!--{eval echo register_static('js/pace.min.js');}-->"></script>
            <script src="<!--{eval echo register_static('js/wow.min.js');}-->"></script>
            <script src="<!--{eval echo register_static('js/jquery.nicescroll.js');}-->" type="text/javascript"></script>

            <script src="<!--{eval echo register_static('js/jquery.app.js');}-->"></script>

            <script src="<!--{eval echo register_static('assets/datatables/jquery.dataTables.min.js');}-->"></script>
            <script src="<!--{eval echo register_static('assets/datatables/dataTables.bootstrap.js');}-->"></script>
            <script src="<!--{eval echo register_static('assets/sweet-alert/sweet-alert.min.js');}-->"></script>
            <script src="<!--{eval echo register_static('assets/sweet-alert/sweet-alert.init.js');}-->"></script>

            <!-- Modal-Effect -->
            <script src="<!--{eval echo register_static('assets/modal-effect/js/classie.js');}-->"></script>
            <script src="<!--{eval echo register_static('assets/modal-effect/js/modalEffects.js');}-->"></script>

            <!--layui-->
            <script src="<!--{eval echo register_static('layer/layer.js');}-->"></script>
            <script src="<!--{eval echo register_static('laytpl/laytpl.js');}-->"></script>

            <script id="list" type="text/html">
                {{# for(var i = 0, len = d.length; i < len; i++){}}
                    <tr>
                        <td>{{d[i].uid}}</td>
                        <td><a href="admin.php?ac=user_profile&uid={{d[i].uid}}"><span class="label label-success">{{d[i].user.nickname}}</span></a></td>
                        <td>{{laytpl.role(d[i].role)}}</td>
                        <td><a href="admin.php?ac=user_profile&uid={{d[i].cUid}}"><span class="label label-primary">{{d[i].createuser.nickname}}</span></a></td>
                        <td>{{laytpl.dateTime(d[i].time)}}</td>
                        <td>
                            <div class="btn-group btn-group-sm">
                            {{# if(d[i].status == '0'){}}
                            <button class="chainuser btn btn-warning" data-uid="{{d[i].uid}}" data-status="1">取消管理员</button>
                            {{# }else{ }}
                            <button class="chainuser btn btn-success" data-uid="{{d[i].uid}}" data-status="0">设置管理员</button>
                            {{# } }}
                            <button class="delete btn btn-danger" data-uid="{{d[i].uid}}">删除管理员</button>
                            </div>
                            <div class="btn-group btn-group-sm">
                                <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">
                                    角色 <span class="caret"></span>
                                </button>
                                <ul class="dropdown-menu" role="menu">
                                    <li><a href="javascript:void(0)" class="chainuser" data-uid="{{d[i].uid}}" data-role="1" >开发</a></li>
                                    <li><a href="javascript:void(0)" class="chainuser" data-uid="{{d[i].uid}}" data-role="2" >运营</a></li>
                                    <li><a href="javascript:void(0)" class="chainuser" data-uid="{{d[i].uid}}" data-role="3" >测试</a></li>
                                    <li><a href="javascript:void(0)" class="chainuser" data-uid="{{d[i].uid}}" data-role="4" >设计</a></li>
                                    <li><a href="javascript:void(0)" class="chainuser" data-uid="{{d[i].uid}}" data-role="5" >商务</a></li>
                                    <li><a href="javascript:void(0)" class="chainuser" data-uid="{{d[i].uid}}" data-role="6" >人事</a></li>
                                    <li><a href="javascript:void(0)" class="chainuser" data-uid="{{d[i].uid}}" data-role="7" >实习</a></li>
                                    <li><a href="javascript:void(0)" class="chainuser" data-uid="{{d[i].uid}}" data-role="8" >超级管理员</a></li>
                                </ul>
                            </div>
                        </td>
                    </tr>
                {{# }}}
            </script>
             <script id="add" type="text/html">
                 <form id="addFormData">
                     <div class="input-group">
                         <span class="input-group-addon" id="basic-addon1">UID&nbsp;&nbsp;</span>
                         <input type="text"  name="uid" class="form-control" placeholder="UID" aria-describedby="basic-addon1">
                     </div>
                     <div class="input-group">
                         <span class="input-group-addon" id="basic-addon2">角色</span>
                         <select  class="form-control" aria-describedby="basic-addon2" name="role" id="role">
                             <option value="1">开发</option>
                             <option value="2">运营</option>
                             <option value="3">测试</option>
                             <option value="4">设计</option>
                             <option value="5">商务</option>
                             <option value="6">人事</option>
                             <option value="7">实习</option>
                             <option value="8">超级管理员</option>
                         </select>
                     </div>
                     <div class="h1">
                         <button id="addForm" class="btn btn-primary" type="button">增加管理员</button>
                     </div>
                 </form>
                         
             </script>
            <script type="text/javascript">
            $(document).ready(function() {
                // 设置table配置
                $('#datatable').dataTable({
                    "iDisplayLength": 50,
                    "aLengthMenu": [10, 20, 50, 100],
                    "searching": false,
                    "bLengthChange" : false,
                    "bSort" : false,
                    "bPaginate": false
                });

                $(document).off('.delete').on('click','.delete',function(){
                    var data = {uid:$(this).data('uid'),action:'deleteAdminUser'};
                    layer.confirm('确认操作!', {
                        btn: ['YES','NO'],icon: 3, title:'提醒'
                    }, function(){
                        request(data, resDisplay)
                    });
                });

                $(document).off('.chainuser').on('click','.chainuser',function(){

                    var data ={action:'chainUser',uid:$(this).data('uid')};
                    if($(this).data('status') !== undefined){
                        data['status'] = $(this).data('status');
                    }
                    if($(this).data('role') !== undefined){
                        data['role'] = $(this).data('role');
                    }
                    request(data,resDisplay);
                });
                $(document).off('#searchByUid').on('click','#searchByUid',function(){
                    var data = {action:'searchAdminUser',uid:$('#inputYourText').val()};
                    request(data);
                });

                $(document).off('#addForm').on('click','#addForm', function (){
                     var data = {action:'addAdminUser'};
                     var datastr = $('#addFormData').serialize();
                     data['uid'] = datastr.split('&')[0].split('=')[1];
                    data['role'] = datastr.split('&')[1].split('=')[1];
                     request(data,resDisplay);
                });

                $(document).off('#addUser').on('click','#addUser', function () {
                    //页面层
                    layer.open({
                        type: 1,
                        skin: 'layui-layer-rim', //加上边框
                        area: ['420px', '200px'], //宽高
                        title:'增加管理员',
                        content: $('#add').html()
                    });
                });
                laytpl.dateTime= function (time) {
                    return new Date(parseInt(time) * 1000).toLocaleString().replace(/:\d{1,2}$/,' ');
                }
                laytpl.status = function(status){
                    var str = '';
                   switch (status){
                       case '1':
                          str = '已封禁';
                           break;
                       case '0':
                           str = '正常';
                           break;
                   }
                    return str;
                }
                laytpl.role = function(role){
                    //1:开发者,2:运营,3:测试,4:设计,5:商务,6:人事,7:实习,8:超级管理员}
                    var str = '';
                    var r = role.toString();
                   switch (r){
                       case '1':
                          str = '开发';
                           break;
                       case '2':
                           str = '运营';
                           break;
                       case '3':
                           str = '测试';
                           break;
                       case '4':
                           str = '设计';
                           break;
                       case '5':
                           str = '商务';
                           break;
                       case '6':
                           str = '人事';
                           break;
                       case '7':
                           str = '实习';
                           break;
                       case '8':
                           str = '超级管理员';
                           break;
                   }
                    return str;
                }
                var request = function(data, func, method, url){
                    layer.load();
                    data   ? data   : data   = {action:'getAdminList'};
                    url    ? url    : url    = 'admin.php?ac=admin';
                    method ? method : method = 'GET';
                    func   ? func   : func   =  list;
                    data['do'] = 'adminUsers';
                    data['op'] = 'start';
                    $.ajax({
                        dataType : 'json',
                        url  : url,
                        type : method,
                        data : data,
                        success: function(returnData){
                            layer.closeAll();
                            func(returnData.result);
                        }
                    });
                }

                var list = function(data){
                    var listtpl = $('#list').html();
                    laytpl(listtpl).render(data.users, function(html){
                        $('#tbody_list').html(html);
                    });
                }

                var resDisplay = function(data){
                    var str = '';
                    if(data == true){
                        str = '操作成功!';
                    }else{
                        str = '操作失败!';
                    }
                    setTimeout(function(){
                        layer.msg(str);
                    },1000);
                    request();
                }
                request();
            } );
            

        </script>
</body>
        </html>